/* eslint-disable eqeqeq */
import React, { useState, useEffect } from "react";
import { getInfo } from "./API/LoginAPI";
import { Image, List ,Dialog  } from "antd-mobile";
import { useHistory } from "react-router-dom";
import { UploadOutline, SetOutline,TextOutline,EditSOutline,FileOutline } from "antd-mobile-icons";

export default function UserInfo() {
  let history = useHistory();

  const [user, setuser]: any = useState({});

  const getUserInfo = async () => {
    let res = await getInfo({});
    console.log(res);
    if (res.data.code === 200) {
      setuser(res.data.user);
    }
  };

  const click = async() => {
    const result = await Dialog.confirm({
      content: '是否退出',
    })
    if (result) {
      window.localStorage.removeItem('token')
      history.push('/')
    }
  }

  useEffect(() => {
    getUserInfo();
  }, []);

  return (
    <div className="boss">
      <div className="username">
        <div className="box">
          <Image
            className="img"
            src={"http://124.93.196.45:10001/prod-api/" + user.avatar}
          ></Image>
        </div>
        <div>{user.userName}</div>
      </div>
      <List>
        <List.Item
          prefix={<TextOutline />}
          onClick={() => {
            history.push("/mine/personal");
            // history.push('/home')
          }}
        >
          个人信息
        </List.Item>
        <List.Item prefix={<FileOutline />} onClick={() => {
          history.push('/mine/orderform')
        }}>
          订单
        </List.Item>
        <List.Item prefix={<SetOutline />} onClick={() => {
          history.push('/mine/changepass')
        }}>
          修改密码
        </List.Item>
        <List.Item prefix={<EditSOutline />} onClick={() => {
          history.push('/mine/feedback')
        }}>
          意见反馈
        </List.Item>
        <List.Item
          prefix={<UploadOutline />}
          onClick={() => {
            click()
          }}
        >
          退出
        </List.Item>
      </List>
    </div>
  );
}
